<template>
    <div>
        <!-- 面板 -->
        <div>
            <mt-tab-container v-model="choose">
                <mt-tab-container-item id="photo">照片区域
                    <img src="../../../public/img/img (2).jpg" class="se">
                </mt-tab-container-item>
                <mt-tab-container-item id="canyin">餐饮区域</mt-tab-container-item>
                <mt-tab-container-item id="delicious">美食区域</mt-tab-container-item>
                <mt-tab-container-item id="cheaper">特价美食</mt-tab-container-item>
            </mt-tab-container>
        </div>
        <!-- 底部导航条 -->
        <div>
            <mt-tabbar v-model="choose" fixed>
                <mt-tab-item id="photo">
                    <img slot="icon" src="../../assets/camera.png">
                    照片
                </mt-tab-item>
                <mt-tab-item id="canyin">
                    <img slot="icon" src="../../assets/chazi.png">
                    餐饮
                </mt-tab-item>
                <mt-tab-item id="delicious">
                    <img slot="icon" src="../../assets/shao.png">
                    美食
                </mt-tab-item>
                <mt-tab-item id="cheaper">
                    <img slot="icon" src="../../assets/wan.png">
                    特价美食
                </mt-tab-item>
            </mt-tabbar>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return {
            choose:"photo"
        }
    }
}
</script>

<style>
    .se{
        width: 100px;
    }
</style>